var context;
var canvasWidth;
var canvasHeight;

function prepareCanvas()
{

    context = document.getElementById('baseCanvas').getContext("2d");

    canvasWidth = jQuery('#baseCanvas').width();
    canvasHeight = jQuery("#baseCanvas").height();

}

function drawBallTrajectory()
{
    switch(ballTrajectoryType)
{
case "line":
          
drawStraightLine();
  break;
  case "pencil":
  drawCustomBallTrajectory();
  break;

default:
break;
}
}



function drawCustomBallTrajectory()
{

    //C4.width = C4.width; // Clears the canvas
    context.clearRect(0, 0, 800, 800);
    context.strokeStyle = "#ffcf33";
    context.lineJoin = "round";
    context.lineWidth = 5;

    for(var i=0; i < ClickX.length; i++)
    {
        context.beginPath();
        if(ClickDrag[i] && i){
            context.moveTo(ClickX[i-1], ClickY[i-1]);
        }else{
            context.moveTo(ClickX[i]-1, ClickY[i]);
        }
        context.lineTo(ClickX[i], ClickY[i]);
        context.closePath();
        context.stroke();
    }

}


function drawStraightLine()
{

            context.clearRect(0, 0, 800, 800);
            context.strokeStyle = "#ffcf33";
            context.lineJoin = "round";
            context.lineWidth = 5;
            context.beginPath();
            context.moveTo(ClickX[0], ClickY[0]);
            context.lineTo(ClickX[1],  ClickY[1]);
            context.stroke();
            context.closePath();
}

